<div id="enterform">
<h1>Вход</h1>
<hr>
<form action="/" method="GET">
<div class="block clearfix"><div class="lblock">Логин:</div><div class="rblock"><input type="text" name="login" id="login" placeholder="Введите admin" /></div></div>
<div class="block clearfix"><div class="lblock">Пароль:</div><div class="rblock"><input type="password" name="pass" id="pass" placeholder="Введите 123" /></div></div>
<div class="buttons"><input type="submit" value="Войти" /></div>
</form>
<div class="loader"></div>
</div>

<script>
var fl = 0;
$('form').submit(function(){	
	$('#enterform .loader').show();
	//Запрос на вход
	$.post('/ajax/enter',{login:$('#login').val(),pass:$('#pass').val()},
	function(data){
		$('#enterform .loader').hide();
		// Получаем результат в формате JSON
		$data = $.parseJSON(data);
		//Если ошибка, то показываем сообщение об ошибке, если нет, то загружаем калькулятор
		if ($data.code==1) showMessage($data.mess)
		else
		{
			// Если мы раньше загружали форму, то отобразим ее, если нет - загрузим
			if ($('#calc').length==0)
			{				
				fl = 0;
				$('#enterform').animate({opacity:'hide'},300);
				setTimeout('halfReady()',350);
				$('<div>').css('display','none').load('/ajax/calc',{},function(){halfReady();}).appendTo('body');
			}
			else
			{
				$('#enterform').animate({opacity:'hide'},300);
				setTimeout(function(){$('#calc').animate({opacity:'show'},300);},350);
			}
		}

	}
	);
	return false;
});
// Ждем когда форма исчезнет, а другая загрузится
function halfReady()
{
	fl++;
	if (fl==2)
	{
		$('#calc').parent().animate({opacity:'show'},500);
	}
}

</script>